<template>
    <div>
        <!-- <common-table :columns="columns" :data="tableData">
            <template slot="isPublic" slot-scope="{ row }">
                {{ transformPublic(row.isPublic) }}
            </template>
            <template slot="operation" slot-scope="{ row }">
                <el-button type="primary">
                    编辑
                </el-button>
                <el-button type="danger">
                    删除
                </el-button>
            </template>
        </common-table> -->
        <jsx-table :columns="columns" :dataList="tableData" hasSelection @commitSelection="getselected">
            <template slot="isPublic" slot-scope="{ row }">
                {{ transformPublic(row.isPublic) }}
            </template>
            <template slot="operation" slot-scope="scope">
                <el-button type="primary">
                    编辑
                </el-button>
                <el-button type="danger">
                    删除
                </el-button>
            </template>
        </jsx-table>
    </div>
</template>

<script>
import JsxTable from '@/components/JsxTable'
export default {
    components: {
        JsxTable
    },
    data() {
        return {
            tableData: [{
                id: 11,
                name: '绿色天使幼儿园',
                count: 100,
                address: '北京',
                isPublic: 1,
            }, {
                id: 22,
                name: '金苹果幼儿园',
                count: 200,
                address: '上海',
                isPublic: 1,
            }, {
                id: 33,
                name: '童趣幼儿园',
                count: 300,
                address: '广州',
                isPublic: 0,
            }, {
                id: 44,
                name: '快乐星球幼儿园',
                count: 400,
                address: '深圳',
                isPublic: 0,
            }],
            columns: [
                { prop: 'id', label: 'id' },
                { prop: 'name', label: '名称' },
                { prop: 'count', label: '人数' },
                { prop: 'isPublic', label: '是否公办', slot: 'isPublic' },
                { prop: 'address', label: '地址' },
                {
                    label: "操作",
                    slot: "operation"
                }
            ]
        }
    },
    methods: {
        // 获取选中行
        getselected(val) {
            console.log('val:', val);
        }
    },
    computed: {
        transformPublic() {
            return function (isPublic) {
                let t = {
                    1: '是',
                    0: '否'
                }
                return t[isPublic]
            }
        }
    }
}
</script>

<style scoped></style>